<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>3-4我的任务(提示)</title>
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/global.css" />
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./css/task-hint.css">
</head>
<body>
<header class="header">
    <p class="color-white">我的订单</p>
</header>
<main class="main">
    <div class="cover-tp">
        <a href="#">
            <img src="img/task-1.jpg" alt="task">
            <span class="color-gray">待付款</span>
        </a>
        <a href="#">
            <img src="img/task-2.jpg" alt="task">
            <span>已付款</span>
        </a>
        <a href="#">
            <img src="img/task-3.jpg" alt="task">
            <span>已完成</span>
        </a>
    </div>
    <div class="cover-bt">
        <a href="#" class="color-green">
            <span>0</span>
        </a>
        <a href="#">
            <span class="color-glod bd-bt">1</span>
        </a>
        <a href="#">
            <span class="color-red">0</span>
        </a>
    </div>
    <div class="content">
        <div class="content-cover">
            <span class="sp-l">设备维护-自助机</span>
            <span class="sp-r">已付款</span>
        </div>
        <div class="content-info">
            <span>任务描述：某景区有2台自助机急需安装维护。</span>
            <span>联系人：&nbsp;&nbsp;&nbsp;小马&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;13825001901</span>
            <span class="info-sm">下单时间：2018年02月28日 17:16</span>
        </div>
    </div>
    <div class="popup">
        <div class="popup-box">
            <img src="img/task-5.jpg" alt="task">
            <span>您有一个订单被打回！</span>
            <a href="task-paid.html">查看详情</a>
        </div>
    </div>
</main>
</body>
</html>